// pages/category/category.js
const app = getApp();
const query = wx.createSelectorQuery().in(this);
Page({
  data: {
    categories: [],
    activeIndex: 0,
    categoryPosition: [],
    disableNextScroll: false
  },
  onLoad(options) {
    const categories = app.globalData.categories;
    if (categories.length === 0) {
      wx.request({
        url: 'https://smart-shop.itheima.net/index.php?s=/api/category/list',
        method: 'GET',
        success: res => {
          console.log(res.data.data.list);
          if (res.data.status === 200) {
            app.globalData.categories = res.data.data.list;
            this.setData({
              categories: res.data.data.list
            });
            this.initCategoryPosition();
          }
        }
      });
    } else {
      this.setData({
        categories: app.globalData.categories
      });
      this.initCategoryPosition();
    }
  },
  initCategoryPosition() {
    const query = wx.createSelectorQuery();
    query.selectAll('.categorybox').boundingClientRect(rects => {
      if (rects.length > 0) {
        const categoryPositions = rects.map(rect => rect.top);
        this.setData({ categoryPosition: categoryPositions });
      }
    }).exec();
  },
  tapCategory: function (e) {
    this.disableNextScroll = true;
    const index = e.currentTarget.dataset.index;
    this.setData({
      activeIndex: index
    });
    this.scrollToCategory(index);
    wx.showToast({
      title: '功能未实现',
      icon: 'error'
    })
  },
  scrollToCategory(index) {
    const query = wx.createSelectorQuery().in(this);
    query.select('#categoryright').boundingClientRect();
    query.select('#category-' + index).boundingClientRect();
    query.select('#categoryright').fields({ components: true }); // 请求组件实例
    query.exec(res => {
      // console.log('滚动查询结果:', res);
      if (res[0] && res[1] && res[2].component) {
        const scrollTop = res[0].scrollTop; // 当前滚动条的位置
        const targetPosition = res[1].top + scrollTop - res[0].top; // 目标位置
        res[2].component.scrollTo({ scrollTop: targetPosition, duration: 300 }); // 滚动到目标位置
      }
    });
  },

  scrollToView(targetPosition) {
    const query = wx.createSelectorQuery().in(this);
    query.select('#categoryright');
    query.exec(res => {
      console.log('滚动视图结果:', res);
      if (res[0] && res[0].component) {
        res[0].component.scrollTo({ scrollTop: targetPosition, duration: 300 });
      }
    });
  },
  onShopScroll: function (e) {
    if (this.disableNextScroll) {
      this.disableNextScroll = false;
      return;
    }
    let scrollTop = e.detail.scrollTop;
    let activeIndex = 0;
    const categoryPosition = this.data.categoryPosition;

    for (let i = 0; i < categoryPosition.length; i++) {
      if (scrollTop >= categoryPosition[i]) {
        activeIndex = i;
      } else {
        break;
      }
    }

    if (activeIndex !== this.data.activeIndex) {
      this.setData({ activeIndex });
    }
  },
  search:function(e) {
    const name=e.currentTarget.dataset.name
    console.log(name);
    wx.navigateTo({
      url: `/pages/searchgoods/searchgoods?name=${name}`,
    })
    
  }
});